
<style type="text/css">
		.bg-color-dred{ background: #FFE8E8!important;}
		.bg-color-ddred{ background: #FFE8E8!important;}
		.bg-color-dyellow{ background: #FFFFD0!important;}
	</style>
<section id="widget-grid" class="">
	<!-- row -->
	<div class="row" id="allTaskBox">
		<!-- NEW WIDGET START -->
			<article class="col-xs-12 col-sm-12 col-md-12 col-lg-12">
				<!-- Widget ID (each widget will need unique ID)-->
				<div class="jarviswidget jarviswidget-color-blueLight" id="wid-id-0" data-widget-sortable="true" data-widget-colorbutton="false" data-widget-editbutton="false" data-widget-togglebutton="false" data-widget-deletebutton="false">
					<header>
						<span class="widget-icon"> <i class="fa fa-table"></i> </span>
						<h2> 线路发车准时率 </h2>
					</header>
					<!-- widget div-->
					<div role="content">
						<!-- widget edit box -->
						<div class="jarviswidget-editbox">
							<!-- This area used as dropdown edit box -->
						</div>
						<!-- end widget edit box -->
						<!-- widget content -->
						<div class="widget-body no-padding">
							
							<!-- 自定义搜索区 -->
							<div class="widget-body-toolbar" style="height:70px;overflow:hidden;">
								<form role="form" class="smart-form">
									<div class="pull-left global-search-box">
										<section class="pull-left no-padding pull-width180" >
											<label class="">订单时间</label>
											<label class="input">
												<i class="icon-prepend fa fa-calendar"></i>
												<input name="in_date" class="input-sm" type="text" id="reservationT" value="14-06-01 - 14-06-30" maxlength="10">
											</label>
											
										</section>
                                        <section class="pull-left no-padding col pull-width160" >
											<label class="">结算线路</label>
											<label class="input">
												<input type="text" name="tid" placeholder="" class="input-sm">
											</label>
										</section>
										<section class="pull-left no-padding col pull-width160" >
											<label class="">承运商</label>
											<label class="input">
												<input type="text" name="tid" placeholder="" class="input-sm">
											</label>
										</section>
										<div class="global-search-btn" >
											<a class="btn btn-primary  btn-sm" type="button">查询</a>
											<!-- <a id="more_search" class="btn btn-sm btn-link" type="button">更多条件</a> -->
								  		</div>
									</div>
									
								</form>
							</div>
							
						  <div class="row no-margin margin-top-10 margin-bottom-10" >
								<div class="col-xs-12 col-sm-12">
									<div class="btn-group">
										<a href="#" class="btn btn-default" type="button" id="daochu">导出</a>
									</div>
								</div>
							</div>
							<table id="dt_basic" class="table table-striped table-bordered table-hover">
								<thead>
									<tr>
										<th>财务结算线路1</th>
										<th>财务结算线路2</th>
										<th>财务结算线路3</th>
										<th>承运商</th>
										<th>配送次数</th>
										<th>准时发车</th>
										<th>晚发车次</th>
										<th>准时发车率</th>
									</tr>
								</thead>
								<tbody>
	                            	<tr>
										<td>北京-广州-北京</td>
										<td>CAN4-PEK3</td>
										<td>广州-北京</td>
										<td>FHY/丰和园</td>
										<td><a href="#">64</a></td>
										<td><a href="#">60</a></td>
										<td><a href="#">4</a></td>
										<td>
											<div class="progress progress-sm no-margin pull-width160">
												<div class="progress-bar bg-color-green" style="line-height:12px" aria-valuetransitiongoal="93.8">93.8%</div>
											</div>
										</td>
									</tr>
									<tr>
										<td>天津-广州-天津</td>
										<td>CAN4-TSN2</td>
										<td>广州-天津</td>
										<td>FHY/丰和园</td>
										<td><a href="#">85</a></td>
										<td><a href="#">79</a></td>
										<td><a href="#">6</a></td>
										<td>
											<div class="progress progress-sm no-margin pull-width160">
												<div class="progress-bar bg-color-green" style="line-height:12px" aria-valuetransitiongoal="92.9">92.9%</div>
											</div>
										</td>
									</tr>
									<tr>
										<td>北京-济南-北京</td>
										<td>PEK3-TSN2-TNA1</td>
										<td>北京-济南</td>
										<td>FLT/福路通</td>
										<td><a href="#">106</a></td>
										<td><a href="#">96</a></td>
										<td><a href="#">10</a></td>
										<td>
											<div class="progress progress-sm no-margin pull-width160">
												<div class="progress-bar bg-color-green" style="line-height:12px" aria-valuetransitiongoal="90.6">90.6%</div>
											</div>
										</td>
									</tr>
									<tr>
										<td>北京-沈阳-北京</td>
										<td>SHE1-PEK3</td>
										<td>沈阳-北京</td>
										<td>XJWL/新杰</td>
										<td><a href="#">52</a></td>
										<td><a href="#">46</a></td>
										<td><a href="#">6</a></td>
										<td>
											<div class="progress progress-sm no-margin pull-width160">
												<div class="progress-bar bg-color-red" style="line-height:12px" aria-valuetransitiongoal="88.5">88.5%</div>
											</div>
										</td>
									</tr>
									<tr>
										<td>成都-武汉-成都</td>
										<td>CTU4-WUH2</td>
										<td>成都-武汉</td>
										<td>FLT/福路通</td>
										<td><a href="#">88</a></td>
										<td><a href="#">75</a></td>
										<td><a href="#">13</a></td>
										<td>
											<div class="progress progress-sm no-margin pull-width160">
												<div class="progress-bar bg-color-red" style="line-height:12px" aria-valuetransitiongoal="85.2">85.2%</div>
											</div>
										</td>
									</tr>
									<tr>
										<td>北京-天津-西安-北京-天津</td>
									  <td>PEK3-TSN2-XIY2</td>
									  <td>北京-天津-西安</td>
										<td>FHY/丰和园</td>
										<td><a href="#">125</a></td>
										<td><a href="#">104</a></td>
										<td><a href="#">4</a></td>
										<td>
											<div class="progress progress-sm no-margin pull-width160">
												<div class="progress-bar bg-color-red" style="line-height:12px" aria-valuetransitiongoal="83.2">83.2%</div>
											</div>
										</td>
									</tr>
									<!-- <tr>
										<td>天津-厦门</td>
									  <td>PEK3-TSN2-XMN2</td>
									  <td>天津-厦门</td>
										<td>FHY/丰和园</td>
										<td><a href="#">64</a></td>
										<td><a href="#">60</a></td>
										<td><a href="#">4</a></td>
										<td>
											<div class="progress progress-sm no-margin pull-width160">
												<div class="progress-bar bg-color-green" style="line-height:12px" aria-valuetransitiongoal="93.8">93.8%</div>
											</div>
										</td>
									</tr>
									<tr>
										<td>广州-厦门-广州</td>
									  <td>XMN2-CAN4</td>
									  <td>厦门-广州</td>
										<td>GZLH/广州联宏</td>
										<td><a href="#">64</a></td>
										<td><a href="#">60</a></td>
										<td><a href="#">4</a></td>
										<td>
											<div class="progress progress-sm no-margin pull-width160">
												<div class="progress-bar bg-color-green" style="line-height:12px" aria-valuetransitiongoal="93.8">93.8%</div>
											</div>
										</td>
									</tr>
									<tr>
										<td>北京-哈尔滨</td>
									  <td>TSN2-PEK3-JLZT-HRB1</td>
									  <td>北京-长春中通速递-哈尔滨</td>
										<td>FHY/丰和园</td>
										<td><a href="#">64</a></td>
										<td><a href="#">60</a></td>
										<td><a href="#">4</a></td>
										<td>
											<div class="progress progress-sm no-margin pull-width160">
												<div class="progress-bar bg-color-green" style="line-height:12px" aria-valuetransitiongoal="93.8">93.8%</div>
											</div>
										</td>
									</tr>
									<tr>
										<td>昆山-北京</td>
									  <td>SHA2-PEK3</td>
									  <td>昆山-北京</td>
										<td>YTL/源泰隆</td>
										<td><a href="#">64</a></td>
										<td><a href="#">60</a></td>
										<td><a href="#">4</a></td>
										<td>
											<div class="progress progress-sm no-margin pull-width160">
												<div class="progress-bar bg-color-green" style="line-height:12px" aria-valuetransitiongoal="93.8">93.8%</div>
											</div>
										</td>
									</tr>
									<tr>
										<td>苏州-昆山-广州-昆山-苏州</td>
									  <td>CAN4-SHA2-SHA3</td>
									  <td>广州-苏州/昆山</td>
										<td>FHY/丰和园</td>
										<td><a href="#">64</a></td>
										<td><a href="#">60</a></td>
										<td><a href="#">4</a></td>
										<td>
											<div class="progress progress-sm no-margin pull-width160">
												<div class="progress-bar bg-color-green" style="line-height:12px" aria-valuetransitiongoal="93.8">93.8%</div>
											</div>
										</td>
									</tr> -->
									                         	
								</tbody>
							</table>
						</div>
						<!-- end widget content -->

					</div>
					<!-- end widget div -->

				</div>
				<!-- end widget -->
			</article>
			
			
		<!-- WIDGET END -->

	</div>

	<!-- end row -->

	<!-- end row -->

</section>


<script src="js/plugin/date/moment.js"></script>
<script src="js/plugin/date/daterangepicker.js"></script>

<script type="text/javascript">

	// DO NOT REMOVE : GLOBAL FUNCTIONS!
	pageSetUp();

	// 更多搜索条件按钮!
	$("#more_search").attr("state","close");			
	$("#more_search").click(function(){
		if ($("#more_search").attr("state") == "close"){
			$(".widget-body-toolbar").css("height","auto");	
			$("#more_search").text("收起条件");
			$("#more_search").attr("state","open");
		}
		else {
			$(".widget-body-toolbar").css("height","70");	
			$("#more_search").text("更多条件");
			$("#more_search").attr("state","close");
			}
	});

	// load bootstrap-progress bar script
	loadScript("js/plugin/bootstrap-progressbar/bootstrap-progressbar.js", progressBarAnimate);

	// Fill all progress bars with animation
	function progressBarAnimate() {
		$('.progress-bar').progressbar({
			display_text : 'fill'
		});
	}

	// PAGE RELATED SCRIPTS

	loadDataTableScripts();
	function loadDataTableScripts() {

		loadScript("js/plugin/datatables/jquery.dataTables-cust.min.js", dt_2);

		function dt_2() {
			loadScript("js/plugin/datatables/ColReorder.min.js", dt_3);
		}

		function dt_3() {
			loadScript("js/plugin/datatables/FixedColumns.min.js", dt_4);
		}

		function dt_4() {
			loadScript("js/plugin/datatables/ColVis.min.js", dt_5);
		}

		function dt_5() {
			loadScript("js/plugin/datatables/ZeroClipboard.js", dt_6);
		}

		function dt_6() {
			loadScript("js/plugin/datatables/media/js/TableTools.min.js", dt_7);
		}

		function dt_7() {
			loadScript("js/plugin/datatables/DT_bootstrap.js", runDataTables);
		}

	}

	function runDataTables() {

		/*
		 * BASIC
		 */
		var oTable = $('#dt_basic').dataTable({
			//"sDom" : "<'dt-top-row'><'dt-wrapper't><'dt-row dt-bottom-row'<'row'<'col-sm-4'i><'col-sm-8 text-right'p>>",
			//"sDom" : '<"dt-row dt-bottom-row"flipt>',
			"sPaginationType" : "bootstrap_full",
			"bFilter": false,
			"bAutoWidth": false,
			"aaSorting": [[ 7, "desc" ]],
			"aoColumns": [
			null,
			null,
			null,
			null,
			null,
			null,
			null,
			{ "bSortable": false ,"sWidth":"160px"}
			],
			//"sScrollX": "110%",
			//"bPaginate": false, //取消翻页显示
			//"bInfo": true,//页脚信息
			//"bScrollAutoCss": true,
			// "sScrollY": "300px",
			// "bScrollInfinite": true,
			//"bScrollCollapse": true,
			// "iScrollLoadGap": 30,
			//"sScrollY": "200px",
			//"bPaginate": false,
			//"bRetrieve": true,
			"oLanguage": {
			"sZeroRecords": "抱歉， 没有找到",
			"sInfo": "从 _START_ 到 _END_ /共 _TOTAL_ 条数据",
			"sInfoEmpty": "没有数据",
			"sInfoFiltered": "(从 _MAX_ 条数据中检索)",
			"oPaginate": {
			"sFirst": "首页",
			"sPrevious": "前一页",
			"sNext": "后一页",
			"sLast": "尾页"
			},
			"sZeroRecords": "没有检索到数据",
			"sProcessing": "<img src='./loading.gif' />"
			},
			"fnDrawCallback": function( oSettings ) {
     			$(oSettings.nTable).css('width','100%');
     			$(oSettings.nTable).find("th,td").css('white-space', 'nowrap');
     			$(oSettings.nTable).find('tbody tr.even').css('backgroundColor', '#FFF');
     			$(oSettings.nTable).find(".btn-group").slice(-5).addClass('dropup');
                $(oSettings.nTable).find(".btn-group").slice(0,3).removeClass('dropup');
                $(oSettings.nTable).parent(".dt-wrapper").css({
                    'overflow': 'auto',
                    'min-height': '390px',
                    'background': '#f9f9f9'
                });
                $(oSettings.nTable).find("th label input,td label input").next("span").css('margin-right', '0');
                $(oSettings.nTable).find("tr:last td").css({
                    "border": '1px solid #DDDDDD'
                });  
                var chk = $(oSettings.nTable).find(".checkAll");
                chk.click(function(event) {
                    if ($(this).prop('checked')) {
                        $(this).parents("table").find('tbody td input.checkbox').prop('checked', true)
                        $(this).siblings("span").removeClass('someone');
                    } else {
                        $(this).parents("table").find('tbody td input.checkbox').prop('checked', false)
                    };
                });
                $(oSettings.nTable).find("td input.checkbox").click(function(event) {
                    if (!$(this).prop('checked')) {
                        chk.siblings("span").addClass('someone');
                    };
                    checkStateAll = true;
                    checkStateOne = false;
                    $("tbody td input.checkbox").each(function(index, el) {
                        checkStateAll = checkStateAll && $(this).prop('checked');
                        checkStateOne = checkStateOne || $(this).prop('checked');
                    });
                    if (checkStateAll) {
                        checkStateOne = false;                      
                        chk.prop('checked', true)
                        chk.siblings("span").removeClass('someone');                     
                    }
                    if (checkStateOne) {
                        chk.prop('checked', true)
                        chk.siblings("span").addClass('someone');
                    }                   
                    if (checkStateAll === checkStateOne) {
                        chk.prop('checked', false)
                        chk.siblings("span").removeClass('someone');                         
                    }
                });
				
 			}

		});

		/* END BASIC */


	}

		
	$(function() {
	    $('#reservation').daterangepicker({
			singleDatePicker: true, //必须要有默input 认value
			timePicker: false,		//是否启用时间选择
			//timePickerIncrement:10,	//分钟选择的间隔
			format: 'YYYY-MM-DD',	//返回值的格式
			timePicker12Hour: false,	//采用24小时计时制
			showDropdowns: true,		//是否显示年、月下拉框
		});

		$('#reservationT').daterangepicker({
			singleDatePicker: false,
			timePicker: false, //是否启用时间选择
			timePickerIncrement: 1, //分钟选择的间隔
			format: 'YY-MM-DD', //返回值的格式
			timePicker12Hour: false, //采用24小时计时制
		});
		
	    /* 浮动菜单的显示和隐藏 */
		$.chat_list_btn = $('#chat-container > .chat-list-open-close');
		$.chat_list_btn.click(function () {
		    var taskMenu = $(this).parent('#chat-container');
		    taskMenu.toggleClass('open');
		})
		setTimeout("hideTaskMenu()", 3000);

		$("#e5").select2({  //自动完成
		    placeholder: "aaaaa",
			allowClear: true,
		    minimumInputLength: 1,
		    data:[{id:0,text:'enhancement'},{id:1,text:'bug'},{id:2,text:'duplicate'},{id:3,text:'invalid'},{id:4,text:'wontfix'}]
		});
		
	});

	function hideTaskMenu(){
		$('#chat-container').removeClass('open');
	}

	function showLastTaskMenu(){
		$("#btnToggleCom").next().next("dl").toggle();
		$("#btnToggleCom").children("i").toggleClass("fa-minus-circle fa-plus-circle");
	}


	//切换浮动菜单的位置
	// function ShowTaskMenu(){
	// 	if(!$("#allTaskBox").hasClass('insideRightFloat')){
	// 		$("#chat-container").css("display","none");
	// 		$("#allTaskBox").addClass("insideRightFloat");			
	// 		$("#taskListBox article").append($("#taskPanel").clone());		
	// 		$("#chat-container #taskPanel").remove();
	// 		$("#toggleTaskBtn i").css("fa-mail-forward");
	// 	}else{
	// 		$("#chat-container").css("display","block").append($("#taskPanel").clone());
	// 		$("#taskListBox article #taskPanel").remove()
	// 		$("#allTaskBox").removeClass("insideRightFloat");
	// 		$("#toggleTaskBtn i").css("fa fa-mail-reply");
	// 	}
	// }

	$("#daochu").bind("click",function(){
		$.smallBox({
				title : "下发安装包链接",
				content : "手机端安装包已成功发送给对方手机！ ",
				color : "#296191",
				timeout: 2000,
				icon : "fa fa-bell swing animated"
			});
	})

	//控制iframe全屏
	$("a.jarviswidget-fullscreen-btn").bind("click",function(){
		parent.iframeFullScreen();
		//return false;
	})

	
	//控制iframe全屏
	// var piframe=$(window.parent.document).find("#right_main");
	// var pbody=$(window.parent.document).find("body");
	// piframe.load(function(){
	// 	$('body').css('background','#FFF')
	// 	var bodyHeight = $('body').prop('scrollHeight');
	// 	//var parentLeftHeight = $(window.parent.document).find("#left-panel").height()-52;
	// 	$(this).height(bodyHeight);
	// 	//$(this).css("min-height",parentLeftHeight+"px");
	// 	console.log(bodyHeight);
	// 	$(window).click(function(){
	// 		$("body").css("height","1px");
	// 		var thisheight1 = $("body").prop("scrollHeight");
	// 		$("body").css("height",thisheight1);
	// 		$(window.parent.document).find("#right_main").css("height",thisheight1);
			
	// 		console.log(thisheight1);
	// 	})

	// 	console.log(piframe.height());
	// 	$("#wid-id-0 .jarviswidget-fullscreen-btn").bind("click",function(){
	// 		piframe.toggleClass("splashScreen");
	// 		pbody.toggleClass("nooverflow");
	// 		var isfullscreen=piframe.hasClass("splashScreen");
	// 		if(isfullscreen){
	// 			piframe.css("height","100%");
	// 		}else{
	// 			piframe.height(bodyHeight);
	// 		}
	// 	})
	// });


</script>
